<template>
	<view id="desigcompany" class="conbox designs">
		<view class="main_content">
			<!-- <text class="renovation">装修店铺</text> -->
			<view class="com_top" :style="bgImg">
				<view class="top_desc"></view>
				<view class="topmain">
					<image class="comimg"></image>
					<view class="company_deil">
						<view class="com_name">用户昵称</view>
						<view class="company_deil_info">
							已服务
							<text class="text_main_color">111</text>
							名业主
							<text class="separate_line">|</text>
							<text>暂无工作经验</text>
						</view>
						<view class="company_deil_tag">
							<image :src="constant.imgUrl+'common/enterprise-authenticate.png'"></image>
							<image :src="constant.imgUrl+'common/excellent_design.png'"></image>
							<image :src="constant.imgUrl+'common/rest_assured.png'"></image>
						</view>
					</view>
				</view>
			</view>
			<view class="company_li">
				<!--<router-link :to="{name:'Inteoffer'}"></router-link>-->
				<view class="item">
					<image :src="constant.imgUrl+'design/company/icon_inteprice.png'"></image>
					<text>智能报价</text>
				</view>
				<!--<router-link :to="{name:'Designhome'}"></router-link>-->
				<!-- <text @click="skiptoshop()">
                    <image :src="constant.imgUrl+'design/company/icon_build_shop.png'">
                    <view>建材商城</view>
                </text> -->
				<view class="item">
					<image :src="constant.imgUrl+'design/company/icon_homedesian.png'"></image>
					<text>户型设计</text>
				</view>
				<view class="item">
					<image :src="constant.imgUrl+'design/company/icon_navcase.png'"></image>
					<text>设计案例</text>
				</view>
				<!--<router-link :to="{name:'Designteam'}"> </router-link>-->
				<view class="item">
					<image :src="constant.imgUrl+'design/company/icon_myteam.png'"></image>
					<text>我的联盟</text>
				</view>
				<!-- <text @click="skiptoenterprise()">
                    <image :src="constant.imgUrl+'design/company/icon_introduce.png'">
                    <view>企业介绍</view>
                </text> -->
			</view>

			<view class="enterance">
				<button class="enter_left" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber"
					data-source="fenshui">
					<image :src="constant.imgUrl+'design/company/icon_blod.png'"></image>
				</button>
				<view class="right-side">
					<view class="enter_sh">
						<image :src="constant.imgUrl+'design/company/icon_livebro.png'"></image>
					</view>
					<view class="enter_btom">
						<image :src="constant.imgUrl+'design/company/icon_starte.png'"></image>
					</view>
				</view>
			</view>
			<view class="module_wrap promotions_wrap">
				<view class="module_title_body">
					<view class="module_title_left">
						<view class="em"></view>
						<text>促销活动</text>
					</view>
					<navigator class="module_title_right">更多</navigator>
				</view>
				<view class="module_wrap_body">
					<swiper class="swiper" :indicator-dots="promotionSwiperConfig.indicatorDots" :autoplay="promotionSwiperConfig.autoplay"
						:interval="promotionSwiperConfig.interval" :duration="promotionSwiperConfig.duration">
						<swiper-item>
							<view class="swiper-item"></view>
						</swiper-item>
						<swiper-item>
							<view class="swiper-item"></view>
						</swiper-item>
						<swiper-item>
							<view class="swiper-item"></view>
						</swiper-item>
					</swiper>
				</view>
			</view>
			<v-puboffer ref="formtable"></v-puboffer>

			<view class="module_list">
				<view class="module_body">
					<view class="module_title">
						<view class="left_sign">
							<view class="em"></view>
							<text>装修攻略</text>
						</view>
						<navigator class="right_sign">更多</navigator>
					</view>
					<view class="tech_process">
						<view class="process_img">
							<image :src="constant.imgUrl+'design/company/icon_process.png'"></image>
						</view>
						<view class="process_btns">
							<view class="item" v-for="(item,index) in btns" :key="index">
								<navigator class="sub_item" :class="{mt20:idx > 3}" v-for="(val,idx) in item"
									:key="idx">{{ val.name }}</navigator>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="module_list decoration_effect">
				<view class="module_body">
					<view class="module_title">
						<view class="left_sign">
							<view class="em"></view>
							<text>装修效果图</text>
						</view>
						<navigator class="right_sign">更多</navigator>
					</view>

					<!-- <view class="swiper"> -->

					<swiper class="swiper" previous-margin="15px" next-margin="15px"
						@change="decorSwiperChange">
						<block v-for="(item,index) in decorEffectSwiperData" :key="index">
							<swiper-item class="swiperitem">
								<view class="itemImg" :class="currentIndex == index ? 'swiperactive': ''">
									<view class="swiper_img_wrap"></view>
									<view class="home_info">
										<view class="home_info_top">
											<text class="home_tit">小区名</text>
											<text class="home_style">
												欧式
											</text>
										</view>
										<view class="home_room">
											<text>两居</text>
											<text class="separate_line">|</text>
											<text>120平</text>
											<text class="separate_line">|</text>
											<text>价格</text>
											<text class="singOn-tag">报名最高可省￥2.3万</text>
										</view>
										<view class="sing_out">
											<text>8人报名</text>
											<text class="separate_line">|</text>
											<text>已有188位业主关注</text>
										</view>
									</view>
								</view>
							</swiper-item>
						</block>
					</swiper>
				</view>
			</view>
			<view class="module_list ">
				<view class="module_body">
					<view>
						<view class="left_sign">
							<view class="em"></view>
							<text>附近工地</text>
						</view>
					</view>
				</view>
				<view class="neary_img" :style="{backgroundImage: 'url(' + mapimg + ')', backgroundSize:'cover',marginTop:'50rpx'}">
					<view class="near_marker">
						<view class="thmarker">
							<view class="outer_txt">附近有 <text class="inner_txt">111</text>个工地 </view>

						</view>
						<image :src="constant.imgUrl+'publicicon/localposition.png'" class="local_marker"></image>
					</view>
					<view class="markerlistf">
						<view class="markerlist_left">
							<view class="maker_title">有内容</view>
							<view class="marker_room">
								<text>户型</text>
								<text class="separate_line">|</text>
								<text>面积</text>
								<text class="separate_line">|</text>
								<text>价格</text>
								<text class="separate_line">|</text>
								<text class="mdistance">距离你？km</text>
							</view>
						</view>
						<view class="markorder">预约参观</view>
					</view>
				</view>
			</view>
			<view class="module_list">
				<view class="module_body">
					<view>
						<view class="left_sign">
							<view class="em"></view>
							<text>优惠活动</text>
						</view>
					</view>
				</view>
				<view class="com_brands com_brands_free">
					<v-coupon></v-coupon>
				</view>
				<view class="panic_buying">
					<view class="top_img_wrap">
						<image :src="constant.imgUrl+'design/panic_buy_banner.png'"></image>
					</view>
					<view class="good_list">
						<view class="item" v-for="(item,index) in panic_buying_list" :key="index">
							<view class="img_wrap">
								<image></image>
								<view class="label"></view>
							</view>
							<view class="good_info">
								<view class="name ellipsis_line_com">电话插座电话插座电话插座电话插座电话插座电话插座</view>
								<view class="price">
									<view class="now">111</view>
									<view class="pass">222</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>

			<view class="designcompany_hot module_list" v-if="false">
				<view class="hot_box">
					<view class="hot_item">
						<image class="hot_pic"></image>
						<view class="hot_title">商品名称</view>
						<view class="hot_price">
							<view class="hot_price_now">
								￥
								<text>价格</text>
							</view>
							<view class="hot_price_before">￥市场价格</view>
						</view>
					</view>
				</view>
			</view>

			<view class="module_list">
				<view class="module_body">
					<view>
						<view class="left_sign">
							<view class="em"></view>
							<text>合作品牌</text>
						</view>
					</view>
				</view>
				<view class="com_brands">
					<!-- <image :src="constant.imgUrl+'design/company/icon_brands.png'"></image> -->
				</view>
			</view>
			<view class="module_list module_lastbtom">
				<view class="module_body w100 ml0">
					<view class="com_btom">
						<view class="company_top_info">
							<image class="comimg"></image>
							<view class="company_deil">
								<view class="com_name">装修公司名称</view>
								<view class="star_class">
									<image :src="constant.imgUrl+'design/company/icon_Stars.png'"></image>
									<image :src="constant.imgUrl+'design/company/icon_Stars.png'"></image>
									<image :src="constant.imgUrl+'design/company/icon_Stars.png'"></image>
									<view class="num_people">
										<text class="gray_txt">已有</text>
										<text>111</text>
										<text class="gray_txt">人咨询</text>
									</view>
								</view>

							</view>
						</view>
						<view class="com_address">
							<view>地 址：'暂无'</view>
							<view>营业时间：'暂无'</view>
						</view>

					</view>
					<view class="com_promise">
						<view class="item">
							<image :src="constant.imgUrl+'center/icon_openchose.png'"></image>
							<text>表面工程保修2年</text>
						</view>
						<view class="item">
							<image :src="constant.imgUrl+'center/icon_openchose.png'"></image>
							<text>隐蔽工程保修5年</text>
						</view>
					</view>
				</view>
				<v-mapNav v-if="!isWxMiniBro" :mapData="userinfo" :userRegions="userRegions"></v-mapNav>
				<view>
					<!-- <v-normalFooter ref="normalFooter"></v-normalFooter> -->
					<!-- <v-defooter ref="defooters"></v-defooter> -->
				</view>
				<!-- <v-appointvist ref="visit"></v-appointvist> -->
				<guide></guide>
			</view>
		</view>
	</view>
</template>

<script>

import { mapGetters, mapState } from 'vuex'
import puboffer from '@/pages/components/puboffer'
import deFooter from '@/pages/components/deFooter'
import normalFooter from '@/pages/components/normalFooter'
import coupon from '@/pages/components/coupon'
import mapNav from '@/pages/components/mapNav'
import appointVisit from '@/pages/components/appointVisit'
import guide from '@/pages/components/guide'
import { getBasicUser, getRoleReal } from '@/utils/auth'
import { getUserInfo } from '@/api/login'
const app = getApp()
export default {
	name: 'DesignCompany',
	components: {
		'v-puboffer': puboffer,
		'v-coupon': coupon,
		'v-mapNav': mapNav,
		'v-defooter': deFooter,
		'v-appointvist': appointVisit,
		guide,
		'v-normalFooter': normalFooter
	},
	data() {
		return {
			option: {},
			constant: getApp().globalData.constant,
			isWxMiniBro: true,
			num: 5,
			mobile: '',
			btns: [
				{
					list: [{ types: '收房', tid: 1 }, { types: '设计', tid: 2 }, { types: '预算', tid: 3 }, {
						types: '材料',
						tid: 4
					}]
				},
				{
					list: [{ types: '拆改', tid: 5 }, { types: '水电', tid: 6 }, { types: '防水', tid: 7 }, {
						types: '泥瓦',
						tid: 8
					}, { types: '木工', tid: 9 }, { types: '油漆', tid: 10 }, { types: '主材', tid: 11 }, {
						types: '竣工',
						tid: 12
					}]
				},
				{ list: [{ types: '软装', tid: 13 }, { types: '入驻', tid: 14 }] }
			],
			goodList: [],
			indicators: false,
			owner_user_id: '',
			prebook_count: 0,
			shop_types: 'user_company',
			headtitle: '装修公司',
			swiperOption: {
				autoplay: false,
				initialSlide: 0,
				autoplayDisableOnInteraction: false,
				slidesPerView: 'auto',
				centeredSlides: true,
				pagination: {
					el: '.swiper-pagination',
					clickable: true
				}
			},
			// 促销活动
			promotionList: [],
			lat: '',
			lng: '',
			mapimg: '',

			currentIndex: 0,
			panic_buying_list: new Array(2),
			bgImg: `background-image: url( ${this.constant.imgUrl}design/company/icon_company.png )`,
			promotionSwiperConfig: {
				indicatorDots: true,
				autoplay: true,
				interval: 2000,
				duration: 1000
			},
			decorEffectSwiperConfig: {
				indicatorDots: false,
				autoplay: false,
				interval: 2000,
				duration: 1000
			},
			decorEffectSwiperData: new Array(3)

		}
	},
	onLoad(option) {
		this.option = option
	},
	mounted() {
		this.$refs.formtable.prebook_source = '装修公司'

		// const pages = getCurrentPages() // 获取加载的页面
		// const currentPage = pages[pages.length - 1] // 获取当前页面的对象
		// const url = currentPage.route // 当前页面url
		// console.log(pages, '页面栈')

		// #ifndef MP-WEIXIN
		this.isWxMiniBro = false
		// #endif
		// #ifdef MP-WEIXIN
		this.isWxMiniBro = true
		// #endif

		/* shoptypes 用来判断管理中心进入店铺设置的状态
            * */
		this.owner_user_id = this.option.owner_user_id
		const puser_id = this.option.share_user_id
		uni.setStorageSync('shoptypes', 'shop')

		// getBasicUser(this.$route.query.owner_user_id, true)
		// getBasicUser(this.$route.query.owner_user_id)
		// getRoleReal()
		// // this.getuserinfo()
		// this._getPromotionList()
		// const that = this
		// setTimeout(function () {
		// 	that.shareweixin()
		// }, 2000)
		// this.getlocation()
	},
	computed: {
		userRegions() {
			return this.$store.state
		},
		...mapGetters({ userinfo: 'getBasicUser' }),
		...mapState({
			loginInfo: state => state.login.loginInfo
		})
	},
	methods: {
		decorSwiperChange(e) {
			this.currentIndex = e.detail.current
		},
		getPhoneNumber(e) {
			console.log(e, '用户信息')
			const data = {
				sessionKey: this.loginInfo.session_key,
				iv: e.mp.detail.iv,
				encryptData: e.mp.detail.encryptedData
			}
			getUserInfo(data).then(res => {
				if (res.status === 'success') {
					this.mobile = res.data.phoneNumber
					if (e.currentTarget.dataset.source === 'fenshui') {
						uni.navigateTo({
							url: `/pages/pagesHome/shop/ShopDivination?mobile=${this.mobile}`
						})
					}
					// this.loginInfo.unionid = res.data.unionId
				}
			})
		}
	}
}
</script>

<style lang="scss">
/*@import url("../../../static/css/module/3Dswiper.scss");*/
    #swiperBox {
        // .page {
        //   // width: 600px;
        //   img {
        //     width: 100%;
        //     height: 400px;
        //   }
        // }
    }

        // image {
        //     display: block;
        //     margin: 0;
        //     width: 100%;
        //     height: 100%;
        //     border-top-left-radius: 10px;
        //     border-top-right-radius: 10px;
        // }
    .panic_buying {
        padding: 15px 30px 30px;
        background-color: #f5f5f5;
        display: flex;
        justify-content: center;
        flex-direction: column;
        .top_img_wrap {
            width: 690px;
            height: 107px;
            image {
                width: 100%;
                height: 100%;
            }
        }
        .good_list {
            padding: 10px;
            background:rgba(255,227,95,1);
            box-shadow:0px -2px 0px 0px rgba(255,253,109,1);
            border-radius:0px 0px 10px 10px;
            display: flex;
            justify-content: space-between;
            .item {
                width: calc(50% - 5px);
                .good_info {
                    padding: 11px 9px 20px 21px;
                    background-color: #fff;;
                    .name {
                        font-size:26px;
                        font-weight:600;
                        color:rgba(51,51,51,1);
                        line-height: 1;
                    }
                    .price {
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        margin-top: 19px;
                        .now,
                        .pass {
                            line-height: 1;
                            font-size:24px;
                        }
                        .now {
                            font-weight:600;
                            color:rgba(255,62,80,1);
                        }
                        .pass {
                            font-weight:400;
                            text-decoration:line-through;
                            color:rgba(153,153,153,1);
                        }
                    }
                }
            }
            .img_wrap {
                height: 328px;
                image {
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
    .home_info {
        background-color: #fffffe;
        & > view {
            padding: 0 20px;
            margin: 16px 0;
            color: #999;
        }
        .home_info_top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            .home_style {
                border-radius: 20px;
                color: #ff9000;
                background-color: #fff1df;
                padding: 4px 8px;
            }
            .home_tit {
                color: #333;
                font-size: 30px;
                font-weight: 600;
            }
        }
    }

    #desigcompany {
        .singOn-tag {
            color: #fff;
            padding: 2px 10px 4px;
            border-radius: 6px;
            background: linear-gradient(to right, #ff1c31, #f424de);
            position: relative;
            margin-left: 27px;
        }
        // .triangle {
        .singOn-tag::before {
            position: absolute;
            left: -10px;
            top: 9px;
            content: '';
            display: block;
            width: 0;
            height: 0;
            border-width: 10px 15px 10px 0;
            border-style: solid;
            border-color: transparent #ff1c31 transparent transparent; /*透明 灰 透明 透明 */
            // margin: 40px auto;
        }
        .sing_out {
            color: #ff6900;
        }
        // 促销活动
        .promotions_wrap {
            .module_wrap_body {
                padding: 40px 0 0;
            }
            .promotion_body {
                position: relative;
                width: 100%;
                // height: 222px;
                border-radius: 20px;
                .promotion_img {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 100%;
                    image {
                        width: 100%;
                        height: 100%;
                        border-radius: 20px;
                    }
                }
                .promotion_message {
                    position: absolute;
                    top: 0;
                    left: 0;
                    color: #fff;
                    padding: 40px 0 0 30px;
                    font-size: 36px;
                    .activity_time {
                        font-size: 24px;
                    }
                    .activity_title {
                        font-weight: bold;
                    }
                }
            }
        }
        // 公共模块
        .module_wrap {
            background-color: #fff;
            padding: 30px;
            margin-top: 20px;
            .module_title_body {
                width: 100%;
                height: 30px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                .module_title_left {
                    font-size: 30px;
                    font-weight: bold;
                    color: #333;
                    display: flex;
                    align-items: center;
                    & > .em {
                        width: 8px;
                        height: 30px;
                        border-radius: 3px;
                        margin-right: 9px;
                        background: -webkit-linear-gradient(rgb(255, 209, 26), rgb(255, 144, 0));
                    }
                }
            }
            .module_title_right {
                background: url('https://wximg.meijiabang.com/hkds/miniapp/images/login/right.png') right center / 15px 24px no-repeat;
                padding-right: 25px;
                color: #999999;
            }
        }
    }
</style>

<style scoped>

.company_top_info {
    display: flex;
}

.com_promise {
    padding: 20px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    background: #f4fdf5;
    margin-top: 30px;
    color: #666666;
}

.com_promise .item {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1 0 auto;
}

.com_promise .item image {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}

.neary_img {
    width: 100%;
    height: 550px;
    position: relative;
    display: flex;
    justify-content: center;
}

.neary_img image {
    width: 100%;
    height: 100%;
}

.neary_img .markorder {
    width: 140px;
    height: 60px;
    color: #3a1b04;
    font-size: 24px;
    text-align: center;
    line-height: 60px;
    border-radius: 30px;
    background: #ffd11a;
    margin-right: 30px;
}

.process_img {
    width: 64px;
    height: 345px;
}
.decoration_effect {
    padding-bottom: 30px;
}
.decoration_effect .swiper {
    margin-top: 30px;
    height: 734px !important;
}
.decoration_effect swiper-item {
    /* width: calc(100% - 70px) !important; */
    border-radius: 10px 10px 0px 0px;
    display: flex;
    justify-content: center;
    /* box-shadow: 0px 1px 10px 0px
		rgba(0, 0, 0, 0.2); */
}
.decoration_effect swiper-item.m20 {
    /* margin: 0 20px; */
}
/* .decoration_effect .swiper_item_wrap {

} */
.decoration_effect .swiper_img_wrap {
    border-radius: 10px 10px 0px 0px;
    overflow: hidden;
    height: 510px;
    background-color: skyblue;
}
.decoration_effect .swiper_img_wrap image{
    width: 100%;
    height: 100%;
}
.com_btom {
    height: auto;
    width: 100%;
    margin-left: 3%;
    margin-right: 3%;
    margin-bottom: 30px;
}

.com_btom .comimg {
    width: 140px;;
    height: 140px;
    border-radius: 10px;
}

.com_btom .company_deil {
    margin-left: 20px;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.com_btom .com_name {
    font-size: 34px;
    display: -webkit-box;
    word-break: break-all;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1;
}

.com_btom .star_class {
    display: flex;
    align-items: center;
    height: 26px;
    width: auto;
    margin-top: 20px;
    line-height: 26px;
    font-size: 24px;
}

.com_btom .star_class image {
    width: 26px;
    height: 26px;
    margin-left: 5px;
}

.com_btom .num_people {
    margin-left: 10px;
    color: #999999;
}

.com_btom .num_people text {
    color: #ff9000;
}

.process_img image {
    width: 100%;
    height: 100%;
}

.tech_process {
    display: flex;
    width: auto;
    margin: 40px 0 0 27px;
}

.com_address {
    line-height: 1;
    margin-top: 31px;
    color: #999999;
}

.tech_process .process_btns {
    margin-left: 30px;
    width: 85%;
}
.process_btns .item{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 40px;
}

.process_btns .sub_item {
    flex: 0 0 auto;
    width: 120px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    color: #666666;
    border: 2px solid #dddddd;
    background: white;
    border-radius: 10px;
}
.process_btns .sub_item.mt20 {
    margin-top: 20px;
}
.module_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 1;
}

.right_sign {
    background: url('https://wximg.meijiabang.com/hkds/miniapp/images/login/right.png') right center / 15px 24px no-repeat;
    padding-right: 25px;
    color: #999999;
}

.left_sign {
    display: flex;
    font-size: 30px;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
}

.left_sign .em {
    width: 8px;
    height: 30px;
    border-radius: 3px;
    margin-right: 9px;
    background: -webkit-linear-gradient(rgb(255, 209, 26), rgb(255, 144, 0));
}

.markerlist_left {
    width: 65%;
    margin-left: 30px;
}

.markerlist_left .maker_title {
    font-size: 30px;
    font-weight: bold;
    color: #333333;
    display: -webkit-box;
    word-break: break-all;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.markerlist_left .marker_room {
    margin-top: 10px;
    font-size: 24px;
    color: #999999;
    display: -webkit-box;
    word-break: break-all;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.markerlist_left .mdistance {
    color: #ff9000;
}

.module_body {
    width: 94%;
    height: auto;
    margin-left: 3%;
    margin-right: 3%;
}

.module_list {
    width: 100%;
    height: auto;
    background: white;
    margin-top: 20px;
    padding-top: 20px;
}

.enter_left {
    width: 280px;
    height: 330px;
    padding: 0;
    border-radius: 0;
    border: 0 none;
}

.com_brands {
    width: 100%;
    height: 450px;
}

.com_brands_free {
    width: 100%;
    height: auto;
}

.com_brands image {
    width: 100%;
    height: 100%;
}

.enterance {
	display: flex;
    width: auto;
    padding-top: 30px;
    padding-bottom: 29px;
    background: white;
    padding-left: 10px;
    box-sizing: border-box;
}

.enter_sh {
    width: 420px;
    height: 160px;
    margin-left: 10px;
}

.enter_btom {
    width: 420px;
    height: 160px;
    margin-top: 10px;
    margin-left: 10px;
}

.enterance image {
	width: 100%;
	height: 100%;
}

.promotions_wrap .swiper {
    height: 222px;
    padding-top: 0;
}

.promotions_wrap .swiper swiper-item view {
    background-color: skyblue;
    height: 100%;
}
.company_li {
    width: 100%;
    height: 215px;
    background: white;
    display: flex;
    align-items: center;
}

.company_li .item {
    display: flex;
    align-items: center;
    flex-direction: column;
	flex: 1 1 auto;
    text-align: center;
}

.company_li .item image {
    width: 90px;
    height: 90px;
    margin-top: 45px;
    /* margin-left: 30px; */
    margin-bottom: 27px;
}

.company_li .item text {
    clear: both;
    color: #666666;
}

.topmain {
    display: flex;
    align-items: flex-start;
    z-index: 0;
    color: white;
    position: absolute;
    top: 0;
    padding-left: 30px;
    padding-top: 50px;
}

.topmain .comimg {
    width: 140px;;
    height: 140px;
    border-radius: 10px;
}

.topmain .company_deil {
    margin-left: 20px;

    /* margin-top: 30px; */
}

.topmain .company_deil .company_deil_info {
    color: #ddd;
}

.topmain .company_deil > div {
    margin-top: 14px;
}

.topmain .company_deil .company_deil_tag {
    display: flex;
    align-items: center;
}

.topmain .company_deil .company_deil_tag > image {
    width: 110px;
    height: 34px;
    margin-right: 20px;
}

.com_name {
    font-size: 34px;
    display: -webkit-box;
    word-break: break-all;
    /* autoprefixer: ignore next */
    -webkit-box-orient: vertical;
    /* autoprefixer: on */
    -webkit-line-clamp: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.top_desc {
    width: 100%;
    height: 250px;
    position: relative;
    background: black;
    opacity: .5;
    top: 0;
    z-index: 0;
}

.designs {
    background: #f5f5f5;
}
.titlename {
    margin-left: 0;
}

.renovation {
    position: absolute;
    top: 1%;
    right: 3%;
    width: 140px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    background: black;
    opacity: 0.8;
    color: white;
    border-radius: 10px;
    z-index: 99;
    margin-right: 0;
}

.main_content {
    margin-top: 0;
}

.module_lastbtom {
    margin-bottom: 37px;
    padding-bottom: 20px;
}

.near_marker {
    width: 334px;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.thmarker{
    width: 334px;
    height: 91px;
    font-size: 30px;
    border-radius: 10px;
    margin-top: 62px;
    background: white;
    line-height: 90px;
    text-align: center;
    background-size: 100%;
    position: relative;
    box-shadow: 0px 2px 10px #cccccc;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.thmarker .outer_txt{
    background: url('https://wximg.meijiabang.com/hkds/miniapp/images/login/right.png') right 20px center / 15px 28px no-repeat;
}
.thmarker .outer_txt .inner_txt{
    color: #ff9000;
}
.thmarker::after{
    content:'';
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid white;
    position: absolute;
    bottom: -15px;
    left: 49%;
    margin-left: -10px;
}
.local_marker{
    width: 56px !important;
    height: 56px !important;
    margin-top: 22px;
}
.markerlistf{
        display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90%;
    height: 130px;
    position: absolute;
    bottom: 20px;
    left: 5%;
    	background-color: #fffffe;
	box-shadow: 0px 1px 10px 0px
		rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	opacity: 0.95;
}

.designcompany_hot {
    width: 100%;
    height: 600px;
    background-color: rgb(245, 245, 245);
    /* background: url("https://wximg.meijiabang.com/hkds/miniapp/images/design/company/hot_bg.png") center center/ 712px 574px no-repeat; */
}

.designcompany_hot .hot_box {
    margin: auto;
    padding-top: 130px;
    width: 670px;
    font-size: 0;
    box-sizing: border-box;
}

.designcompany_hot .hot_box .hot_item {
    display: inline-block;
    width: 330px;
    height: 430px;
    background-color: #fff;
}

/* .designcompany_hot .hot_box .hot_item:first-child {
    margin-right: 10px;
} */

.designcompany_hot .hot_box .hot_pic {
    display: block;
    width: 330px;
    height: 330px;
    background-color: lightblue;
}

.designcompany_hot .hot_box .hot_title {
    padding: 0 20px;
    font-size: 26px;
    color: #333;
    font-weight: bold;
    text-align: center;
    line-height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
}

.designcompany_hot .hot_box .hot_price {
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
}

.designcompany_hot .hot_price_now {
    font-size: 24px;
    color: #ff3e50;
    font-weight: bold;
}

.designcompany_hot .hot_price_now text {
    font-size: 36px;
}

.designcompany_hot .hot_price_before {
    font-size: 24px;
    color: #999;
    text-decoration: line-through;
}
</style>

